//---------------------------------
// Your own functions here
//---------------------------------

//------------------------------------------------
// Call this function when the "logout" button is clicked
//-------------------------------------------------
function logout() {

}

document.addEventListener("DOMContentLoaded", function() {
    const taskInput = document.getElementById("taskInput");
    const addTaskBtn = document.getElementById("addTaskBtn");
    const taskList = document.getElementById("taskList");
  
    // Load tasks from localStorage
    loadTasks();
  
    addTaskBtn.addEventListener("click", function() {
      const taskText = taskInput.value.trim();
      if (taskText !== "") {
        addTask(taskText);
        taskInput.value = "";
        saveTasks();
      }
    });
  
    function addTask(taskText) {
        const li = document.createElement("li");
        li.className = "list-group-item task-item";
        li.innerHTML = `
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="taskCheckbox">
            <label class="form-check-label" for="taskCheckbox">${taskText}</label>
          </div>
          <div class="btn-group float-end">
            <button class="btn btn-warning btn-edit" title="编辑">编辑<i class="bi bi-pencil-fill"></i></button>
            <button class="btn btn-danger btn-delete" title="删除">删除<i class="bi bi-trash-fill"></i></button>
          </div>
        `;
        
        // 找到所有已完成的任务项
        const completedTasks = document.querySelectorAll(".list-group-item.task-item.completed");
      
        // 如果存在已完成的任务项，则插入到它们的上方；否则，直接追加到列表末尾
        if (completedTasks.length > 0) {
          completedTasks.forEach(completedTask => {
            completedTask.insertAdjacentElement('beforebegin', li);
          });
        } else {
          taskList.appendChild(li);
        }
        
        addTaskEventListeners(li);
      }
      

      
      
      function addTaskEventListeners(li) {
        const editBtn = li.querySelector(".btn-edit");
        const deleteBtn = li.querySelector(".btn-delete");
        const taskTextSpan = li.querySelector("label");
      
        const checkbox = li.querySelector(".form-check-input");
      
        checkbox.addEventListener('change', function() {
          if (this.checked) {
            li.classList.add('completed');
            taskList.appendChild(li); // 将已完成的任务项移到列表底部
          } else {
            li.classList.remove('completed');
          }
          saveTasks();
        });
      
        editBtn.addEventListener("click", function() {
          const newText = prompt("编辑任务", taskTextSpan.textContent);
          if (newText !== null) {
            taskTextSpan.textContent = newText.trim();
            saveTasks();
          }
        });
      
        deleteBtn.addEventListener("click", function() {
          li.remove();
          saveTasks();
        });
      }
      
  
 
    function saveTasks() {
      const tasks = [];
      const taskItems = document.querySelectorAll(".task-item");
      taskItems.forEach(function(taskItem) {
        tasks.push(taskItem.querySelector("label").textContent);
      });
      localStorage.setItem("tasks", JSON.stringify(tasks));
    }
    function loadTasks() {
      const tasks = JSON.parse(localStorage.getItem("tasks"));
      if (tasks) {
        tasks.forEach(function(taskText) {
          addTask(taskText);
        });
      }
    }
  });
  

  // Add event listeners for dropdown menu
function setupNavbar() {
    // Dropdown menu
    $('.dropdown').hover(
        function() {
            $(this).find('.dropdown-content').slideDown(200);
        },
        function() {
            $(this).find('.dropdown-content').slideUp(200);
        }
    );

    // Close dropdown when clicking outside
    $(document).on('click', function(event) {
        if (!$(event.target).closest('.dropdown').length) {
            $('.dropdown-content').slideUp(200);
        }
    });
}

document.querySelectorAll('.form-check-input').forEach(function(checkbox) {
    checkbox.addEventListener('change', function() {
      var taskItem = this.closest('.list-group-item');
      if (this.checked) {
        taskItem.classList.add('completed');
      } else {
        taskItem.classList.remove('completed');
      }
    });
  });




  